<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<meta name="viewport" content="width=device-width, initial-scale=1">
		<title>上云就上阿里云</title>
	</head>
	<style type="text/css">
		*{margin: 0;padding: 0;;font:12px/1.5 "\5FAE\8F6F\96C5\9ED1", "Microsoft Yahei", "Hiragino Sans GB", tahoma, arial, "\5B8B\4F53";}
		a{color:black;text-decoration:none;}
		input,button{border:none;outline: none;}
		ul{list-style:none;}
		.clearfix::after{content: " ";height:0px;display: block;clear:both;overflow: hidden;}
		.top-container{background:rgb(34,37,46) url(img/beijing.jpg) no-repeat  center center;height:640px;width: 100%; object-fit: initial;background-size:1920px 640px; position:relative; }
		.top-container .top-hover{height:101px;border-bottom:1px solid #35383c;}
		.top{height:50px;width:100%;background:rgba(28,35,39,0);border-bottom:1px solid #35383c;overflow: hidden;}
		.top  .top-button {width: 50px;height:50px;float:left;border-right:1px solid #35383c;text-align: center;line-height: 50px;}
		.top  .top-button:hover{background: #33cde5;}
		.top  .top-button .san {padding-top: 17px;width:18px;height:14px;}
		.top .logo {float:left;position:relative;}
		.top .logo a{margin-top:13px;margin-left:8px;display: block;width:80px;}
		.top .logo a .logo1{width:80px;vertical-align: middle;}
		.top .logo a .logo2{width:80px;position:absolute;top:16px;left:8px;}
		.top a{font-size:14px;color:#fff;}
		.top ul {float:right;}
		.top ul li{float:left;height:50px;line-height: 50px;padding: 0 15px;}
		.top ul li a img{width:16px;height:16px;vertical-align: middle;margin-right: 5px;}
		.top span{display: inline-block;font-size:14px;color:#fff;}
		.top .china:hover{background: rgb(39,43,47);height:80px;}
		.top .serch-container .search_text{font-size:14px;color:white;width: 162px;height:50px;padding-left: 16px;padding-right: 22px;background: rgb(50,55,58);}
		.top .serch-container .search_text:hover{border: 1px solid rgb(0,193,222);height:48px;width:262px;}
		.top .serch-container .search-img{width:16px;height:16px;position: absolute;top: 17px;right: 17px;opacity: 0.7;}
		.serch-container{position:relative;overflow: hidden;display: inline-block;float:right;cursor:pointer;}
		.top-container .top-hover .nav ul{margin-left: 10px;}
		.top-container .top-hover .nav ul li{float:left;height:50px;margin:0 16px;line-height: 50px;}
		.top-container .top-hover .nav ul li a{font-size: 14px;color:white;display: block;height:50px;line-height: 50px;}
		/**/
		.top-container .top-hover .nav ul li a:hover{color:#00c1de;}
		.top-container .top-hover a:hover{color:#00c1de;}
		/**/
		.top-container .top-hover .nav .regin{width: 120px;float:right;height:50px;color:white;background:rgb(0,193,222);font-size: 14px;cursor:pointer;}
		.top-container .top-hover .nav .regin:hover{background:rgb(40,208,233);}
		.top-hover:hover{background:rgba(28,35,39,1);}
		.top-container .img-a {position:relative;color:white;height: 403px;}
		.top-container .img-a  .img-a{display: block;height: 100%;width: 100%;}
		.top-container .img-a .float-a{position: absolute;;top:73px;left:25px;height: 300px;}
		.top-container .img-a .float-a h1{font-size: 40px;margin-bottom: 10px;}
		.top-container .img-a .float-a p{font-size:20px;margin-bottom: 40px;}
		.top-container .img-a .float-a .word-a{color:white;font-size:20px;font-weight: bold;display: block;border-bottom:3px solid rgb(0,193,222);width:105px;padding-bottom: 5px;}
		.top-container .img-a .float-a .word-a:hover{color:rgb(0,193,222);}
		
		.top-container .foot-a{background:rgba(28,35,39,0.4); }
		.top-container .foot-a ul{width:1200px;height:136px;margin: 0 auto;}
		.top-container .foot-a ul li{float:left;height:136px;width:240px;}
		.top-container .foot-a ul li a{border-left:1px solid #727577;display: block;height:82px;width:187px;padding: 30px 26px 24px 26px;border-color:hsla(0,0%,100%,.06);}
		.top-container .foot-a ul li a:last-child{border-right:1px solid #727577;border-color:hsla(0,0%,100%,.06);}
		.top-container .foot-a ul li a:hover{background:rgba(50,55,58,0.8);}
		.top-container .foot-a ul li a p:first-child{color:white;font-size: 16px;margin-bottom: 8px;font-weight: bold;width:187px;height:18px;}
		.top-container .foot-a ul li a p:last-child{font-size:14px;width: 187px;height:48px;line-height: 24px;color:#fff;opacity: .6;}
		.con-body{height:1130px;margin-top: 1px auto;}
		.con-body .body-top .aolin{display: block;width: 165px;margin:32px auto 23px;}
		.con-body .body-top .slogan{font-size: 24px;color:#373d41;text-align:center;}
		.con-body .body-top .slogan-a{display: block;margin: 7px auto 0;font-size:16px;text-align: center;}
		.con-body .body-top ul {margin: 60px  0 16px;}
		.con-body .body-top ul  li{float:left;margin-left: 143px;cursor:pointer;position:relative; }
		.con-body .body-top ul  li a{display: block;}
		.con-body .body-top img{width:80px;height:80px;}
		.con-body .body-top ul li a p{font-size: 14px;text-align: center;}
		.con-body .body-top ul li a img~img{display: none;}
		.con-body .body-top ul  a:hover p{color:rgb(0,193,222);}
		.con-body .body-top ul  a:focus .img01{display: none;}
		.con-body .body-top ul  a:focus .img02{display: inline;}
		.con-body .body-top ul  a:focus p{color:rgb(0,193,222);	}
		.con-body .body-top ul  a:focus + div{
			display: block;
		}
		
		.con-body .body-top ul li > div:hover{
			display:block ;
		}
		.con-body .body-top ul li > div{
			position:absolute;
			display: none;
			background: red;
			
		}
		.con-body .body-top ul li .m-gray-1{
			top:120px;
			left:-150px;
			height: 400px;
			width:1300px;
			text-align: left;
			display: block;
		}

		.con-body .body-top ul li .m-gray-2{
			top:120px;
			left:-380px;
			height: 400px;
			width:1300px;
			text-align: left;
			background: ;
		}
		.con-body .body-top ul li .m-gray-3{
			top:120px;
			left:-610px;
			height: 400px;
			width:1300px;
			text-align: left;
		}
		.con-body .body-top ul li .m-gray-4{
			top:120px;
			left:-840px;
			height: 400px;
			width:1300px;
			text-align: left;
			background: #00FF00;
		}
		.con-body .body-top ul li .m-gray-5{
			top:120px;
			left:-1070px;
			height: 400px;
			width:1300px;
			text-align: left;
		}
		
		
		.con-body .body-top ul li .m-gray-1 .m-gray-1-left-button{
			width:390px;
			height:360px;
			background: #00FF00;
		}
		.con-body .body-top ul li .m-gray-1 .m-gray-1-left-button .p01{
			height: 15px;
			line-height: 15px;
		}
		.con-body .body-top ul li .m-gray-1 .m-gray-1-left-button .p01 img{
			width: 26px;
			height:11px;	
			vertical-align: middle;
		}
		.con-body .body-top ul li .m-gray-1 .m-gray-1-left-button .p02{
			margin-top: 10px;
			font-size: 12px;
			color:#9b9ea0;
			padding-left: 24px;
		}
		
		.con-body .body-top ul li .m-gray-1 .m-gray-1-left-button input{
			margin-left: 24px;
			margin-top: 15px;
			width:100px;
			height:28px;
			border:1px solid #373d41;
		}
		.con-body .body-top ul li .m-gray-1 .m-gray-1-left-button input:hover{
			border:1px solid #00c1de;
			color:#00c1de;
		}
		.con-body .body-top .foot{
			margin-top: 400px;
			height:400px;
		}
		.con-body .body-top .foot ul{
			height:200px;
			overflow: hidden;
			margin-top:30px;
		}
		.con-body .body-top .foot ul li{
			float: left;
			
		} 
		.con-body .body-top .foot .ul01{
			height:150px;
			margin-bottom: 0px;
		}
		.con-body .body-top .foot .ul02{
			margin-top:0px;
			height:150px;
		}
		.con-body .foot .foot-button{
			height:100px;
		}
		.con-body .foot .foot-button input{
			font-size: 14px;
			width:130px;height:36px;
			border:1px solid #373d41;
			background: white;
			margin: 0 auto;
			display: block;
			
		}
		.con-body .foot .foot-button input:hover{
			border:1px solid #00c1de;
			color:#00c1de;
		}
		
		.nav-img{height:500px;width:100%;height:368.375px;background: #000000;}
		.nav-img ul{height:368.375px;margin: 0 50px;}
		.nav-img ul li {float:left;	height:368.375px;width:252.6px;}
	 	.nav-img ul li .img1{background: url(img/1n.jpg) ;display: block;background-size:100% 100%; height:368px;width:252px;}
		.nav-img ul li .img2{background: url(img/2n.jpg);display: block;background-size:100% 100%;height:368px;width:252px;}
		.nav-img ul li .img3{background: url(img/3n.jpg);display: block;background-size:100% 100%; height:368px;width:252px;}
		.nav-img ul li .img4{background: url(img/4n.jpg);display: block;background-size:100% 100%;height:368px;width:252px;}
		.nav-img ul li .img5{background: url(img/5n.jpg);display: block;height:368px;width:252px;background-size:100% 100%;} 
		.nav-img ul li a .div-img{display: block;height:368px;width:252px;background: rgba(0,0,0,0.5);position:relative;}
		.nav-img ul li a .div-img img{width:63.15px;height:63.15px;display: block;position: absolute;left:37%;top:30%}
		.nav-img ul li a .div-img .con-p{height:100px;position: absolute;left:26%;top:48%}
		.nav-img ul li a .div-img .con-p p{font-size: 20px;color: white;font-weight: bold;text-align: center;}
		.nav-img ul li a .div-img-hidden{display: none;height:368px;width:252px;background: rgba(51,205,229,0.9);position:relative;}
		.nav-img ul li a .div-img-hidden img{width:63.15px;height:63.15px;display: block;position: absolute;left:37%;top:15%}
		.nav-img ul li a .div-img-hidden p{font-size: 20px;color: white;font-weight: bold;text-align: center;position: absolute;left:22%;top:35%;}
		.nav-img ul li a .div-img-hidden div{display: table-cell;text-align: center;height:100px;font-size:14px;color:white;padding:0 20px;position: absolute;top:50%;}	
		.nav-img ul li a .div-img-hidden input{font-size: 14px;width:130px;height:36px;border:1px solid white;background: transparent;margin: 0 auto;display: block;position:absolute;top :76%;left:22%;color:white;}
		.nav-img ul li a .div-img-hidden input:hover{border:1px solid #00c1de;color:#00c1de;background: white;}
		.nav-img ul li a:hover .div-img{display: none;}
		.nav-img ul li a:hover .div-img-hidden{display: block;}
		.hai{height:572px;padding: 72px 0 0 0;text-align: center;}
		.hai .slogan{font-size: 24px;text-align: center;}
		.hai .slogan-a{display: inline-block;margin-top:10px;color:rgb(95,99,101);font-size:16px;}
		.hai .slogan-a:hover{color:#33cde5;}
		.hai .tbl{height:400px;padding: 0 30px;margin-top:30px;}
		.hai .tbl .tbl-div{width: 400px;height:200px;float:left;margin-top: 20px;}
		.hai .tbl .tbl-div .tbl-img{position:relative;}
		.hai .tbl .tbl-div .tbl-img .katong-con .katong{margin: 0 auto;width: 75px;height:75px;background:	 url(img/donghua1.jpg) no-repeat 0 0;background-size:100%;}
		.hai .tbl .tbl-div .tbl-img .katong-con p{font-size: 20px;font-weight:bold;margin-bottom: 10px;}
		.hai .tbl .tbl-div .tbl-img .katong-con:hover p{color:#33cde5;}
		.hai .tbl .tbl-div .tbl-img .con-a{margin: 0 auto;width:300px;}
		.hai .tbl .tbl-div .tbl-img .con-a ul{overflow: hidden;}
		.hai .tbl .tbl-div .tbl-img .con-a ul li{float:left;margin-right: 5px;}
		.hai .tbl .tbl-div .tbl-img .con-a a{color:rgb(169,176,180);font-size:14px;vertical-align: middle;}
		.hai .tbl .tbl-div .tbl-img .con-a a:hover{color:#33cde5;}
		.hai .tbl .tbl-div .tbl-img .con-a  span{font-size: 14px;color:#dcddde;vertical-align: middle;}
		.shu::after{content:"";width:1px;position:absolute;top:118px;bottom:5px;left:98px;display: block;background: rgb(169,176,180);}
		.dakai{height: 606px;text-align: center; background: #f5f5f5;overflow: hidden;}
		.dakai .slogan{font-size: 24px;text-align: center;margin-top: 50px;}
		.dakai .slogan-a{display: inline-block;margin-top:10px;color:rgb(95,99,101);font-size:16px;}
		.dakai .slogan-a:hover{color:#33cde5;}
		.dakai ul{
			width:
		}
		.dakai ul li{
			float: left;
		}
		.dakai ul li .img-div{
			width:378px;
			object-fit: contain;
			height:170px;
		}
		.dakai ul li .img-div .img {
			
		}
 </style>

	<body>
		<div class="top-container">
			<div class="top-hover">
				<div class="top">
					<div class="top-button">
						<img class="san" src="img/TB17mppCFOWBuNjy0FiXXXFxVXa-36-28.png" >
					</div>
					<div class="logo">
						<a href="#" ><img  class="logo1" src="img/logo1.png" ><img class="logo2" src="img/log3.gif" ></a>
					</div>
					<ul>
						<li class="china"><span>中国站</span>div</li>
						<li><a href="#"><img src="img/TB1VeJxwgmTBuNjy1XbXXaMrVXa-32-32.png" >购物车</a></li>
						<li><a href="#">控制台</a></li>
						<li><a href="#">文档</a></li>
						<li><a href="#">备案</a></li>
						<li><a href="#">邮箱</a></li>
						<li><a href="#">登录</a></li>
					</ul>
					<div class="serch-container">
						<input class="search_text" placeholder="123456" />
						<img class="search-img" src="img/TB169ppCFOWBuNjy0FiXXXFxVXa-32-32.png" >
					</div>
				</div>
				<div class="nav clearfix">
					<ul>
						<li><a href="#">最新活动</a></li>
						<li><a href="#">产品</a></li>
						<li><a href="#">解决方案</a></li>
						<li><a href="#">定价</a></li>
						<li><a href="#">ET大脑</a></li>
						<li><a href="#">智能数据</a></li>
						<li><a href="#">安全</a></li>
						<li><a href="#">云市场</a></li>
						<li><a href="#">支持与服务</a></li>
						<li><a href="#">合作伙伴</a></li>
					</ul>
					<input type="submit" class="regin" value="免费注册" />
				</div>
			</div>	
			<div class="img-a clearfix">
				<a class="img-a"   href="#"></a>
				<div class="float-a">
					<h1>HBaseCon Asia 2018</h1>
					<p>Apache HBase官方授权顶级开源盛会</p>
					<a class="word-a" href="#">点击报名-></a>
					
				</div>
			</div>
			
			<div class="foot-a clearfix">
				<ul>
					<li>
						<a href="#">
							<p>免费套餐</p>
							<p>提供40余款高性能云产品，帮助您获得上云实践经验</p>
						</a>
					</li>
					<li>
						<a href="#">
							<p>弹性裸金属服务器</p>
							<p>结合物理机与虚拟机优势，多地域已支持8核32G</p>
						</a>
					</li>
					<li>
						<a href="#">
							<p>体验智能视频 AI</p>
							<p>智能处理封面、内容，提供视频指纹、新闻拆条等功能</p>
						</a>
					</li>
					<li>
						<a href="#">
							<p>时间序列数据库 TSDB</p>
							<p>已发布轻量版，更低成本运维和存储，更高效完成聚合分析</p>
						</a>
					</li>
					<li>
						<a href="#">
							<p>应用配置管理</p>
							<p>显著降低迭代发布次数，有效保证配置信息安全性</p>
						</a>
					</li>
				</ul>
			</div>
		</div>
		
		<div class="con-body clearfix">
			<div class="body-top clearfix">
				<img class="aolin" src="img/TB1EGNRRVXXXXazXVXXXXXXXXXX-271-123.png" >
				<p class="slogan">全球领先、安全、稳定的云计算产品</p>
				<a class="slogan-a" href="#">计算、存储、网络、安全、大数据、人工智能，普惠科技助您飞跃发展</a>
				<ul class="clearfix">
					<li class="li01"  >
						<a class="a01" href="javascript:void(0);" >
							<img  class="img01" src="img/TB1fk0RQVXXXXajXVXXXXXXXXXX-160-160.png" >
							<img class="img02" src="img/TB1XhNOQVXXXXXcaXXXXXXXXXXX-160-160.png" >
							<p>弹性计算</p>
						</a>
						<div class="m-gray-1">
							<div class="m-gray-1-left-button">
								<div class="p01"> 云服务器 ECS <img src="img/TB1nusxPXXXXXb0aXXXXXXXXXXX-56-24.png" > </div>
								<p class="p02">全面覆盖多场景需求的高性能云服务器</p>
								<input type="submit" value="立即购买">
								<p class="p01">轻量应用服务器</p>
								<p class="p02">快速搭建和易于管理的轻量级云服务器</p>
								<input type="submit" value="立即购买">
							</div>
							
							
						</div>
					</li>
					<li  class="li02" >
						<a class="a02" href="javascript:void(0);" >
							<img  class="img01" src="img/TB1oCR6QVXXXXXXXFXXXXXXXXXX-160-160.png" >
							<img class="img02" src="img/TB1s_xUQVXXXXXiXVXXXXXXXXXX-160-160.png" >
							<p>储存和CDN</p>
						</a>
						<div class="m-gray-2">
							123
						</div>
					</li>
					<li class="a03" class="li03" >
						<a href="javascript:void(0);" >
							<img  class="img01" src="img/TB1kZRHQVXXXXX.aXXXXXXXXXXX-160-160.png" >
							<img class="img02" src="img/shujuku.png" >
							<P>数据库</P>
						</a>
						<div class="m-gray-3">
							123
						</div>
					</li>
					<li  class="a04" class="li04" >
						<a href="javascript:void(0);">
							<img  class="img01" src="img/TB1UeN.QVXXXXX1XFXXXXXXXXXX-160-160.png" >
							<img class="img02" src="img/TB1hCRYQVXXXXa7XFXXXXXXXXXX-160-160.png" >
							<p>网络</p>
						</a>
						<div class="m-gray-4">
							123
						</div>
					
					</li>
					<li class="a05"  class="li05" >
						<a href="javascript:void(0);">
							<img  class="img01" src="img/TB1Qr4RQVXXXXbvXVXXXXXXXXXX-160-160.png" >
							<img class="img02" src="img/TB1Y.p7QVXXXXXHXFXXXXXXXXXX-160-160.png" >
							<p>域名与网站</p>
						</a>
						<div class="m-gray-5">
							123
						</div>
					</li>
				</ul>
				
				
				<div class="foot">
					<ul class="ul01">
						<li>
							<a href="#">
								<img src="img/TB1EnOXQVXXXXcUXpXXXXXXXXXX-160-160.png">
								<p>安全</p>
							</a>
						</li>
						<li>
							<a href="#">
								<img src="img/TB1EnOXQVXXXXcUXpXXXXXXXXXX-160-160.png">
								<p>安全</p>
							</a>
						</li>
						<li>
							<a href="#">
								<img src="img/TB1EnOXQVXXXXcUXpXXXXXXXXXX-160-160.png">
								<p>安全</p>
							</a>
						</li>
						<li>
							<a href="#">
								<img src="img/TB1EnOXQVXXXXcUXpXXXXXXXXXX-160-160.png">
								<p>安全</p>
							</a>
						</li>
						<li>
							<a href="#">
								<img src="img/TB1EnOXQVXXXXcUXpXXXXXXXXXX-160-160.png">
								<p>安全</p>
							</a>
						</li>
					</ul>
					<ul class="ul02">
						<li>
							<a href="#">
								<img src="img/TB1EnOXQVXXXXcUXpXXXXXXXXXX-160-160.png">
								<p>安全</p>
							</a>
						</li>
						<li>
							<a href="#">
								<img src="img/TB1EnOXQVXXXXcUXpXXXXXXXXXX-160-160.png">
								<p>安全</p>
							</a>
						</li>
						<li>
							<a href="#">
								<img src="img/TB1EnOXQVXXXXcUXpXXXXXXXXXX-160-160.png">
								<p>安全</p>
							</a>
						</li>
						<li>
							<a href="#">
								<img src="img/TB1EnOXQVXXXXcUXpXXXXXXXXXX-160-160.png">
								<p>安全</p>
							</a>
						</li>
						<li>
							<a href="#">
								<img src="img/TB1EnOXQVXXXXcUXpXXXXXXXXXX-160-160.png">
								<p>安全</p>
							</a>
						</li>
					</ul>
					<div class="foot-button">
						<input  type="submit" value="查看全部"/>
					</div>
					
					
				</div>
			</div>
		</div>
		
		<div class="nav-img">
			<ul>
				<li>
					<a href="#" class="img1" >
						<div class="div-img">
							<img src="img/1k.png" >
							<div class="con-p">
								<p>----</p>
								<p>APP解决方案</p>
							</div>
						</div>
						<div class="div-img-hidden">
							<img src="img/1kb.png">
							<p>APP解决方案</p>
							<div>一站式提供“海量存储、高效分发、极速网络”等服务， 轻松坐享CCTV-5、微博的传播能力</div>
							<input type="submit" value="查看详情" />
						</div>
					</a>
				</li>
				<li>
					<a href="#" class="img2" >
						<div class="div-img">
							<img src="img/1k.png" >
							<div class="con-p">
								<p>----</p>
								<p>APP解决方案</p>
							</div>
						</div>
						<div class="div-img-hidden">
							<img src="img/1kb.png">
							<p>APP解决方案</p>
							<div>一站式提供“海量存储、高效分发、极速网络”等服务， 轻松坐享CCTV-5、微博的传播能力</div>
							<input type="submit" value="查看详情" />
						</div>
					</a>
				</li>
				<li>
					<a href="#" class="img3" >
						<div class="div-img">
							<img src="img/1k.png" >
							<div class="con-p">
								<p>----</p>
								<p>APP解决方案</p>
							</div>
						</div>
						<div class="div-img-hidden">
							<img src="img/1kb.png">
							<p>APP解决方案</p>
							<div>一站式提供“海量存储、高效分发、极速网络”等服务， 轻松坐享CCTV-5、微博的传播能力</div>
							<input type="submit" value="查看详情" />
						</div>
					</a>
				</li>
				<li>
					<a href="#" class="img4" >
						<div class="div-img">
							<img src="img/1k.png" >
							<div class="con-p">
								<p>----</p>
								<p>APP解决方案</p>
							</div>
						</div>
						<div class="div-img-hidden">
							<img src="img/1kb.png">
							<p>APP解决方案</p>
							<div>一站式提供“海量存储、高效分发、极速网络”等服务， 轻松坐享CCTV-5、微博的传播能力</div>
							<input type="submit" value="查看详情" />
						</div>
					</a>
				</li>
				<li>
					<a href="#" class="img5" >
						<div class="div-img">
							<img src="img/1k.png" >
							<div class="con-p">
								<p>----</p>
								<p>APP解决方案</p>
							</div>
						</div>
						<div class="div-img-hidden">
							<img src="img/1kb.png">
							<p>APP解决方案</p>
							<div>一站式提供“海量存储、高效分发、极速网络”等服务， 轻松坐享CCTV-5、微博的传播能力</div>
							<input type="submit" value="查看详情" />
						</div>
					</a>
				</li>
			</ul>
		</div>
		
		<div class="hai">
			<p class="slogan">海纳百川，精选全球的高品质软件与服务</p>
			<a class="slogan-a" href="#">开发者工具、建站、API、企业应用，支撑云端应用服务</a>
			<div class="tbl">
				<div class="tbl-div">
					<div class="tbl-img">
						<div class="katong-con">
							<div class="katong">
							</div>
							<p>基础软件</p>
						</div>
						
						<div class="con-a">
							<ul>
								<li><a href="#">预装PHP</a><span>&nbsp;|&nbsp;</span></li>
								<li><a href="#">预装ASP/.NET</a><span>&nbsp;|&nbsp;</span></li>
								<li><a href="#">应用开发工具</a></li>
								<li><a href="#">预装建站系统</a><span>&nbsp;|&nbsp;</span></li>
								<li><a href="#">预装PHP</a><span>&nbsp;|&nbsp;</span></li>
								<li><a href="#">预装PHP</a></li>
							</ul>
							
						
						</div>
					</div>
				</div>
				<div class="tbl-div">
					<div class="tbl-img">
						<div class="katong-con">
							<div class="katong">
							</div>
							<p>基础软件</p>
						</div>
						<div class="con-a">
							<ul>
								<li><a href="#">预装PHP</a><span>&nbsp;|&nbsp;</span></li>
								<li><a href="#">预装ASP/.NET</a><span>&nbsp;|&nbsp;</span></li>
								<li><a href="#">应用开发工具</a></li>
								<li><a href="#">预装建站系统</a><span>&nbsp;|&nbsp;</span></li>
								<li><a href="#">预装PHP</a><span>&nbsp;|&nbsp;</span></li>
								<li><a href="#">预装PHP</a></li>
							</ul>
							
						
						</div>
					</div>
				</div>
				<div class="tbl-div">
					<div class="tbl-img">
						<div class="katong-con">
							<div class="katong">
							</div>
							<p>基础软件</p>
						</div>
						<div class="con-a">
							<ul>
								<li><a href="#">预装PHP</a><span>&nbsp;|&nbsp;</span></li>
								<li><a href="#">预装ASP/.NET</a><span>&nbsp;|&nbsp;</span></li>
								<li><a href="#">应用开发工具</a></li>
								<li><a href="#">预装建站系统</a><span>&nbsp;|&nbsp;</span></li>
								<li><a href="#">预装PHP</a><span>&nbsp;|&nbsp;</span></li>
								<li><a href="#">预装PHP</a></li>
							</ul>
							
						
						</div>
					</div>
				</div>
				<div class="tbl-div">
					<div class="tbl-img">
						<div class="katong-con">
							<div class="katong">
							</div>
							<p>基础软件</p>
						</div>
						<div class="con-a">
							<ul>
								<li><a href="#">预装PHP</a><span>&nbsp;|&nbsp;</span></li>
								<li><a href="#">预装ASP/.NET</a><span>&nbsp;|&nbsp;</span></li>
								<li><a href="#">应用开发工具</a></li>
								<li><a href="#">预装建站系统</a><span>&nbsp;|&nbsp;</span></li>
								<li><a href="#">预装PHP</a><span>&nbsp;|&nbsp;</span></li>
								<li><a href="#">预装PHP</a></li>
							</ul>
							
						
						</div>
					</div>
				</div>
				<div class="tbl-div">
					<div class="tbl-img">
						<div class="katong-con">
							<div class="katong">
							</div>
						<p>基础软件</p>
						</div>
						<div class="con-a">
							<ul>
								<li><a href="#">预装PHP</a><span>&nbsp;|&nbsp;</span></li>
								<li><a href="#">预装ASP/.NET</a><span>&nbsp;|&nbsp;</span></li>
								<li><a href="#">应用开发工具</a></li>
								<li><a href="#">预装建站系统</a><span>&nbsp;|&nbsp;</span></li>
								<li><a href="#">预装PHP</a><span>&nbsp;|&nbsp;</span></li>
								<li><a href="#">预装PHP</a></li>
							</ul>
							
						
						</div>
					</div>
				</div>
				<div class="tbl-div">
					<div class="tbl-img">
						<div class="katong-con">
							<div class="katong">
							</div>
							<p>基础软件</p>
						</div>
						<div class="con-a">
							<ul>
								<li><a href="#">预装PHP</a><span>&nbsp;|&nbsp;</span></li>
								<li><a href="#">预装ASP/.NET</a><span>&nbsp;|&nbsp;</span></li>
								<li><a href="#">应用开发工具</a></li>
								<li><a href="#">预装建站系统</a><span>&nbsp;|&nbsp;</span></li>
								<li><a href="#">预装PHP</a><span>&nbsp;|&nbsp;</span></li>
								<li><a href="#">预装PHP</a></li>
							</ul>
							
						
						</div>
					</div>
				</div>
			</div>
		</div>
		
		<div class="dakai">
			<p class="slogan">大咖云集，知识分享的开发者技术社区</p>
			<a class="slogan-a" href="#">实战干货、在线直播、专家问答、技术论坛，学习，成长，分享，共建</a>
			
			<div id="con-div">
				<ul>
					<li>
						<div class="img-div">
							<div class="img">
								<img src="img/div-img1.jpg" >
							</div>
							<p>【合集】2018年上半年云栖大会资料合集</p>
						</div>
					</li>
					<li>
						<div class="img-div">
							<div class="img">
								<img src="img/div-img2.png" >
							</div>
							<p>【聚能聊】那些年你参加过的或者知道的算法大赛</p>
						</div>
					</li>
					<li>
						<div class="img-div">
							<div class="img">
								<img src="img/div-img3.jpg" >
							</div>
							<p>【订阅】AI产生类似动物网格细胞功能可走出迷宫</p>
						</div>
					</li>
				</ul>
			</div>
			
		</div>
	
	</body>
</html>